<!DOCTYPE html>
<html lang="en">

<head>

	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0"> 

  <title>移动医生站 —— 登录</title>


  <link href="vendor/toast/toast.css" rel="stylesheet" type="text/css" >
  <!-- <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/css/bootstrap.min.css"> -->
  <link href="css/sb-admin-2.css" rel="stylesheet" type="text/css">
  <link href="vendor/login/styles.css" rel="stylesheet" type="text/css" />
  <link href="vendor/login/demo.css" rel="stylesheet" type="text/css" />
<style>
      .sanjiao {
        position: relative;
        height: 150px;
        width: 150px;
        /* -webkit-clip-path: polygon(0% 0%, 100% 0%, 50% 100%);
        clip-path: polygon(0% 0%, 100% 0%, 50% 100%); */
      }
  </style>
</head>

<body>
  <!-- <div class="container ">

    <div id="outer" class="row justify-content-center ">

      <div class="col-xl-10 col-lg-12 col-md-9">

        <div class="card o-hidden border-0 shadow-lg my-5">
          <div class="card-body p-0">
            <div class="row">
              <div class="col-lg-6 d-none d-lg-block bg-login-image"></div>
              <div class="col-lg-6" style="background-color: transparent;">
                <div class="p-5" style="background-color: transparent;">
                  <br>
                  <div class="text-center">
                    <h1 class="h4 text-gray-900 mb-4">医生工作站</h1>
                  </div>
                  <br>
                  <br>
                  <form class="user">
                    <div class="form-group">
                      <input type="text" class="form-control form-control-user" id="username"
                        aria-describedby="emailHelp" placeholder="账号">
                    </div>
                    <div class="form-group">
                      <input type="password" class="form-control form-control-user" id="password" placeholder="密码">
                    </div>
                    <div class="form-group">
                          <button id="selectdepartment" type="button" class="btn btn-primary dropdown-toggle"
                            data-toggle="dropdown" style="width: 100%;background-color: white;color: #2653d4;"> 
                            选择科室
                          </button>
                          <div id="department" class="dropdown-menu">
                            <a class="dropdown-item" href="#" onclick="showsPatients($(this).text())" style="text-align: center;">妇科</a>
                            <a class="dropdown-item" href="#" onclick="showsPatients($(this).text())" style="text-align: center;">儿科</a>
                            <a class="dropdown-item" href="#" onclick="showsPatients($(this).text())" style="text-align: center;">口腔科诊</a>
                            <a class="dropdown-item" href="#" onclick="showsPatients($(this).text())" style="text-align: center;">手术科</a>
                            <a class="dropdown-item" href="#" onclick="showsPatients($(this).text())" style="text-align: center;">外科</a>
                            <a class="dropdown-item" href="#" onclick="showsPatients($(this).text())" style="text-align: center;">男科</a>
                            <a class="dropdown-item" href="#" onclick="showsPatients($(this).text())" style="text-align: center;">放射科</a>
                          </div>
                    </div>
                    <div class="form-group row">
                      <div class="col-lg-6 col-sm-6 " style="text-align:left;">
                        <div class="custom-control custom-checkbox small ">
                          <input type="checkbox" class="custom-control-input" id="customCheck">
                          <label class="custom-control-label" for="customCheck">记住密码</label>
                        </div>
                      </div>
                      <div class="col-lg-6 col-sm-6 " style="text-align: right;">
                        <div class="custom-control small">
                          <a style="text-decoration:underline" href="p_forgotpassword.html">忘记密码?</a>
                        </div>
                      </div>
                    </div>
                    <div class="form-group">
                      <br>
                    </div>
                    <div id="login" class="btn btn-primary btn-user btn-block">
                      登录
                    </div>
                  </form>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div> -->


  <div  class="row" style="width: auto;height: auto;">
    <div class='login col-xl-10 col-lg-12 col-md-9'>    
      <div class='login_fields' style="position: relative;text-align: center;height: 150px;">
        <img class='sanjiao' src="vendor/login/login-icon.png"/>
      </div>
      <div class='login_title' style="text-align:center;">
        <h3 class="">移动医生工作站</h3>
      </div>
      <div class='login_fields' style="position: relative;">
        <div class='login_fields__user'>
          <div class='icon'>
            <img alt="" src='vendor/login/user_icon_copy.png'>
          </div>
          <input id="username" name="login" placeholder='用户名' maxlength="32" type='text' autocomplete="off" value=""/>
            <div class='validation'>
              <img alt="" src='vendor/login/tick.png'>
            </div>
        </div>
        <div class='login_fields__password' >
          <div class='icon'>
            <img alt="" src='vendor/login/lock_icon_copy.png'>
          </div>
          <input name="pwd" id="password" placeholder='密码' maxlength="32" type='text' autocomplete="off">
          <div class='validation'>
            <img alt="" src='vendor/login/tick.png'>
          </div>
        </div>
        <div class='login_fields__user' >
          <div class="form-group" >
            <button id="selectdepartment" type="button" class="btn btn-primary dropdown-toggle"
              data-toggle="dropdown" style="margin:5% 10% 10% 10%;width: 80%;background-color: white;color: #2653d4;"> 
              选择科室
            </button>
            <div id="department" class="dropdown-menu">
              <a class="dropdown-item" href="#" onclick="showsPatients($(this).text())" style="text-align: center;">妇科</a>
              <a class="dropdown-item" href="#" onclick="showsPatients($(this).text())" style="text-align: center;">儿科</a>
              <a class="dropdown-item" href="#" onclick="showsPatients($(this).text())" style="text-align: center;">口腔科诊</a>
              <a class="dropdown-item" href="#" onclick="showsPatients($(this).text())" style="text-align: center;">手术科</a>
              <a class="dropdown-item" href="#" onclick="showsPatients($(this).text())" style="text-align: center;">外科</a>
              <a class="dropdown-item" href="#" onclick="showsPatients($(this).text())" style="text-align: center;">男科</a>
              <a class="dropdown-item" href="#" onclick="showsPatients($(this).text())" style="text-align: center;">放射科</a>
            </div>
          </div>
        </div>

        <div class="form-group row">
          <div class="col-lg-6 col-sm-6 " style="text-align:left;">
            <div class="custom-control custom-checkbox small ">
              <input type="checkbox" class="custom-control-input" id="customCheck">
              <label class="custom-control-label" for="customCheck">记住密码</label>
            </div>
          </div>
          <div class="col-lg-6 col-sm-6 " style="text-align: right;">
            <div class="custom-control small">
              <a style="text-decoration:underline" href="p_forgotpassword.html">忘记密码?</a>
            </div>
          </div>
        </div>
        <!-- <div class='login_fields__password'>
          <div class='icon'>
            <img alt="" src='vendor/login/key.png'>
          </div>
          <input name="code" placeholder='验证码' maxlength="4" type='text' name="ValidateNum" autocomplete="off">
          <div class='validation' style="opacity: 1; right: -5px;top: -3px;">
            <canvas class="J_codeimg" id="myCanvas" ">对不起，您的浏览器不支持canvas，请下载最新版浏览器!</canvas>
          </div>
        </div> -->
        <div class='login_fields__user' >
          <div id="login" class='login_fields__submit' style="text-align:center">
            <input type='button' value='登录'>
          </div>
        </div>
        <div class='login_fields__user' style="text-align: center;margin-top: 90px;">
          <h6>@广东医科大学毕业设计</h6>
        </div>
      </div>
    </div> 
    <div class="OverWindows"></div>
  </div>
    <script src="https://cdn.staticfile.org/axios/0.18.0/axios.min.js"></script>
  <script src="vendor/jquery/jquery.min.js"></script>
  <script src="vendor/login/particleground.js" type="text/javascript"></script>
  <script src="vendor/toast/toast.js"></script>
  <script src="js/p_common.js"></script>
  <script src="vendor/bootstrap/js/bootstrap.bundle.min.js"></script>

  
  <script>
          var canGetCookie = 0;//是否支持存储Cookie 0 不支持 1 支持
      var ajaxmockjax = 1;//是否启用虚拟Ajax的请求响 0 不启用  1 启用
        //粒子背景特效
        $('body').particleground({
            dotColor: '#E8DFE8',
            lineColor: '#133b88'
        });
        $('input[name="pwd"]').focus(function () {
            $(this).attr('type', 'password');
        });
        $('input[type="text"]').focus(function () {
            $(this).prev().animate({ 'opacity': '1' }, 200);
        });
        $('input[type="text"],input[type="password"]').blur(function () {
            $(this).prev().animate({ 'opacity': '.5' }, 200);
        });
        $('input[name="login"],input[name="pwd"]').keyup(function () {
            var Len = $(this).val().length;
            if (!$(this).val() == '' && Len >= 5) {
                $(this).next().animate({
                    'opacity': '1',
                    'right': '30'
                }, 200);
            } else {
                $(this).next().animate({
                    'opacity': '0',
                    'right': '20'
                }, 200);
            }
        });
        var fullscreen = function () {
            elem = document.body;
            if (elem.webkitRequestFullScreen) {
                elem.webkitRequestFullScreen();
            } else if (elem.mozRequestFullScreen) {
                elem.mozRequestFullScreen();
            } else if (elem.requestFullScreen) {
                elem.requestFullscreen();
            } else {
                //浏览器不支持全屏API或已被禁用  
            }
        }  
        $("#department").css("width", $("#selectdepartment").width()+20+"px");

    let url = '/login';
    $("#login").click(
      function () {
        let username = $("#username").val();
        let password = $("#password").val();
        axios.post
          (url, {
            "username": username,        // 参数 用户名
            "password": password,    // 参数 密码
          })
          .then(function (response) { // 请求成功处理
            if (response.data["code"]==1){
              mytoast('info',"成功登录，准备跳转到入院登记页面");
              setTimeout(() => {
                window.location = "p_ruyuandengji.html";
              }, 3000);
            }
            else
              mytoast("primary",response.data["msg"]);
          })
          .catch(function (error) { // 请求失败处理
            mytoast('info',error.message);
            console.log(error);
          });
      }
    );
    function showsPatients(txt) {
      $('#selectdepartment').text(txt);
    }

  </script>

</body>

</html>